<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        /* 找所有的元素是否带有href属性 10 */
        [href]{
            color: yellow;
            font-size: 30px;
        }
        /* 找所有元素是否带有href="a.mp3"的精确匹配 */
        /* [href="a.mp3"]{
            color: red;
        } */
        /* 找所有元素是否带有href,并以'a'开始 */
        /* [href^='a']{
            color: green;
        } */
        /* 找所有元素是否带有href,并以'3'结尾 */
        /* [href$="3"]{
            color: pink;
        } */
        /* 属性中带有.都会匹配上  */
        /* [href="."]{
            color: blue;
        } */
        /* 标签选择器100＋属性选择器100=200 */
        div[href="a.mp3"]{
            color: red;
        }
        a[href="a.mp3"]{
            color: green;
        }
    </style>
</head>
<body>
    <a href="a.mp3">a.mp3</a><br>
    <a href="b.mp3">b.mp3</a><br>
    <a href="a.mp4">a.mp4</a><br>
    <a href="b.mp4">b.mp4</a><br>
    <div href="">强行给div加一个href属性,成为自定义属性</div>
</body>
</html>